import React from "react"
import ReactDOM from "react-dom"
import loading from "./shared/libs/loading"
import "index.less"

import {BrowserRouter, Route, Switch} from "react-router-dom"
import zhCN from 'antd/lib/locale-provider/zh_CN'
import {LoadingOutlined} from '@ant-design/icons'
import {ConfigProvider, message, Spin} from 'antd'
import Prelude from "./index/prelude"
import {userSetting} from "./shared/libs/antd-theme"


const root = document.getElementById("root")
const supportsHistory = 'pushState' in window.history
const App = loading(() => import("./index/app"))
const NotFound = loading(() => import("./index/errors/404"))
const Login = loading(() => import("./index/login"))


const globalConfig = {
  // renderEmpty: () => <Empty/>,
}

message.config({
  duration: 2,
  top: 10,
  getContainer: () => {
    const appContainer = document.getElementById('app-container-right')
    const root = appContainer == null ? document.body : appContainer
    return root
  }
})

const antIcon = <LoadingOutlined style={{fontSize: 24}} spin/>
Spin.setDefaultIndicator(antIcon)
userSetting(true)

const onWindowLoad = () => {
  if (document.readyState === 'complete') {
    setTimeout(() => {
      ReactDOM.render(
        <ConfigProvider locale={zhCN}>
          <ConfigProvider {...globalConfig}>
            <BrowserRouter basename={"/"} forceRefresh={!supportsHistory}>
              <Switch>
                <Route path="/" exact={true} component={Login}/>
                <Route path="/login" exact={true} component={Login}/>
                <Route path="/app" component={App}/>
                <Route component={NotFound}/>
              </Switch>
            </BrowserRouter>
          </ConfigProvider>
        </ConfigProvider>
        , root)
    }, 500)
  } else {
    ReactDOM.render(
      <Prelude/>
      , root)
  }
}

document.onreadystatechange = onWindowLoad

